import type { ProDescriptionsItemProps } from '@/components/ProDescriptions';
import ProDescriptions from '@/components/ProDescriptions';
import { updateAdminInfo } from '@/pages/user/Admin/service';
// import { ProFormText } from '@ant-design/pro-form';
import { Col, Row, Tag } from 'antd';
import React from 'react';
import type { DetailItem } from '../data';

const LockerDetail: React.FC<{
  id?: string;
  request: (id: string) => Promise<{ success: boolean; data?: DetailItem }>;
  reloadFunc: () => void;
  tenant_id?: string;
}> = ({ id = '', request, reloadFunc }) => {
  // @ts-ignore
  const columns: ProDescriptionsItemProps<DetailItem>[] = [
    {
      label: '管理员名称',
      dataIndex: 'name',
      editable: true,
      // renderEdit: (_, { value, onChange }) => {
      //   return (
      //     <ProFormText
      //       width={500}
      //       name="address"
      //       label=""
      //       placeholder="请输入"
      //       rules={[{ required: true, message: '请输入停车场详细位置' }]}
      //     />
      //   );
      // },
      onSubmit: async (value) => {
        const res = await updateAdminInfo({ name: value, id });
        return res.code === 0;
      },
    },
    {
      label: '管理员账号',
      dataIndex: 'userName',
    },
    {
      label: '拥有角色',
      dataIndex: 'roles',
      span: 20,
      render: (_, record) => (
        <Row gutter={[16, 8]}>
          {record?.roles?.map((item) => (
            // eslint-disable-next-line react/jsx-key
            <Col span={200}>
              <Tag key={item.id}>{item.name}</Tag>
            </Col>
          ))}
        </Row>
      ),
      editable: true,
      // renderEdit: (_, { value, onChange }) => (
      //   <AuthRoleConfiguration
      //     tenant_id={tenant_id}
      //     defaultValue={value}
      //     id={id}
      //     onChange={(values) => {
      //       console.log('values', values);
      //       return onChange && onChange(values);
      //     }}
      //   />
      // ),
      // onSubmit: async (value) => {
      //   const res = await updateAdminRoles({ id, roles: value });
      //   return res.code === 0;
      // },
    },
  ];

  return (
    <div>
      <ProDescriptions
        title="管理员账号详情"
        column={1}
        columns={columns}
        params={{ id }}
        request={() => request(id)}
        reloadFunc={reloadFunc}
      />
    </div>
  );
};

export default LockerDetail;
